﻿
@using Abc.Core;
@using Abc.Core.Entities
@{
    ViewData["Title"] = "数据配置";
}
<div class="layui-row layui-col-space10">
    <div class="layui-card" id="headsearch">
        <div class="layui-card-body" style="padding: 0px;">
            <form class="layui-form" action="javascript:;" id="queryform">
                <input type="hidden" name="PKey" value="@(ViewBag.PKey)"/>
                <div class="layui-form-item">
                   
                    <div class="layui-inline">
                        <label class="layui-form-mid">关键词</label>
                        <div class="layui-input-inline" style="width: 300px;">
                            <input type="text" id="KeyWords" name="KeyWords" placeholder="输入关键词模糊查询" class="layui-input">
                        </div>
                    </div>
                    <div class="layui-inline">
                        <label class="layui-form-mid">创建日期</label>
                        <div class="layui-input-inline">
                            <input class="layui-input" name="StartDate" id="StartDate" placeholder="开始日期" >
                        </div>
                        <div class="layui-form-mid">-</div>
                        <div class="layui-input-inline">
                            <input class="layui-input" name="EndDate" id="EndDate" placeholder="结束日期" >
                        </div>
                    </div>
                    <div class="layui-inline">
                        <div id="search" class="layui-btn  submitbtn" data-type="search" lay-submit lay-filter="search"> <i class="layui-icon layui-icon-search"></i>查找</div>
                        <div id="reset" type="reset" class="layui-btn layui-btn-primary"><i class="layui-icon layui-icon-refresh">重置</i></div>
                    </div>
                </div>
            </form>
        </div>
    </div>
    <div class="layui-card">
        <div class="layui-card-body" style="padding: 0px;">
            <table id="listData" class="layui-hide" lay-filter="listData"></table>
        </div>
    </div>
</div>

<script type="text/html" id="toolbar">
    <div class="pear-btn pear-btn-primary pear-btn-md" lay-event="add"><i class="layui-icon layui-icon-add-1"></i>新增</div>
    <div class="pear-btn pear-btn-danger pear-btn-md" lay-event="batchRemove"><i class="layui-icon layui-icon-delete"></i>删除</div>
</script>
@*tablebar*@
<script type="text/html" id="tablebar">
    <button class="pear-btn pear-btn-primary pear-btn-sm" lay-event="edit"><i class="layui-icon layui-icon-edit"></i></button>
    <button class="pear-btn pear-btn-danger pear-btn-sm" lay-event="delete"><i class="layui-icon layui-icon-delete"></i></button>
    @*<button class="pear-btn pear-btn-sm" id="more_{{d.userId}}"><i class="layui-icon layui-icon-triangle-d"></i></button>*@
</script>

<script type="text/html" id="tpl_IsEnable">
    <input type="checkbox" name="IsEnable" objid="{{d.Id}}" lay-skin="switch" lay-text="启用|禁用" lay-filter="IsEnable" {{ d.IsEnable ? 'checked' : '' }}>
</script>
<script type="text/html" id="tpl_Type">
{{# if(d.Type==1){ }}
  <span class="layui-badge layui-bg-orange">IPV4</span>
{{# }else { }}
  <span class="layui-badge layui-bg-blue">IPV6</span>
{{# } }}
</script>
@section Scripts{
    <script>
           layui.use(['table', 'form', 'jquery', 'drawer', 'dropdown',  'layer'], function () {
            let $ = layui.jquery;
            let layer = layui.layer;
            let table = layui.table;
            let form = layui.form;
            let drawer = layui.drawer;
            let dropdown = layui.dropdown;
           
            abc.indexInit();
            //监听头工具栏事件
            table.on('toolbar(listData)',function(obj) {
                if (obj.event === 'add') {
                    abc.open({ title:'新增', url:'@(Url.Action("Add"))?Pkey=@(@ViewBag.PKey)', area:['600px', '350px'], end:window.refresh });
               } else if (obj.event === 'refresh') {
                   window.refresh();
               } else if (obj.event === 'batchRemove') {
                   var ids = abc.getSelectDataIds(table,"listData");
                   if (ids.length === 0) {
                       layer.msg("未选中数据", { icon: 3,time: 1000});
                       return false;
                   }
                   abc.delete({url: "@(Url.Action("BatchDelete"))", data: { ids: ids }, success: function () {window.refresh()}});
               }
            });
    
            table.on('tool(listData)', function (obj) { //注：tool是工具条事件名，test是table原始容器的属性 lay-filter="对应的值"
                var data = obj.data; //获得当前行数据
                var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
                var tr = obj.tr; //获得当前行 tr 的DOM对象
                if (layEvent === 'delete') { //删除
                    abc.delete({url:"@(Url.Action("BatchDelete"))",data:{ ids: data.Id },success:function(){obj.del();window.refresh()}});
                } else if (layEvent === 'edit') { //编辑
                    window.edit(obj);
                } else if (obj.event === 'save') {
                    if (editrowids.indexOf(obj.data.Id) == -1) {
                        abc.failure("请先修改后再保存")
                    }
                    else {
                        abc.success("保存成功消息")
                    }
                }
    
            });
            //table 行双击事件
            table.on('rowDouble(listData)', function (obj) { window.edit(obj); });
            //table 行中的事件监听
            //编辑
            window.edit=  function(obj) {
               abc.open({ title: '编辑', url: '@(Url.Action("Info"))/' + obj.data.Id, area: ['600px', '350px'], end: window.refresh });
            }
            
                
            //Table 初始化
            //, templet: '#tpl_user'
            var cols= [
                    [
                        //, templet: '#tplRechargeState'
                        //{ type: 'checkbox', fixed: 'left'},
                        //{ type: 'numbers', fixed: 'left', rowspan: 1 },
                        //{ title: '标签', 'toolbar': '#tplable', fixed: 'left', width: 100 },
                        //{ title: 'ID', field: 'Id', width: 60 },
                        
                        { title: 'ID', field: 'Id', width: 60, align:'center' },
                     
                        { title: '名称', field: 'Name', minWidth: 60, align:'center' },
                        { title: '排序', field: 'Sort', minWidth: 60, align:'center' },
                        { title: '备注', field: 'Remark', minWidth: 60, align:'center' },
                      
                        //{ title: '创建用户ID', field: 'CreatorUserId', width: 130, align:'center',hide:true },
                        { title: '创建用户', field: 'CreatorUserName', minWidth: 60, align:'center' },
                        { title: '创建时间', field: 'CreationTime', width: 130, align:'center',hide:true },
                        //{ title: '更新用户ID', field: 'UpdateUserId', width: 130, align:'center',hide:true },
                        { title: '更新用户', field: 'UpdateUserName', minWidth: 60, align:'center' },
                        { title: '更新时间', field: 'UpdateTime', width: 130, align:'center',hide:true },
                        //{ title: '默认假删除', field: 'IsDeleted', width: 130, align:'center',hide:true },
                        //{ title: '删除用户ID', field: 'DeletedUserId', width: 130, align:'center',hide:true },
                        //{ title: '删除用户', field: 'DeletedUserName', width: 130, align:'center',hide:true },
                        //{ title: '删除时间', field: 'DeletedTime', width: 130, align:'center',hide:true },
                        
                        { title: '操作', fixed: 'right', width: 80, align: 'left', toolbar: '#tablebar' }
                    ]
                ];
             //表格下拉菜单
            window.tableDone = function (res, curr, count) {}
            //初始化table
            abc.initTable("listData", cols, { title: '数据配置' });
           
            //提交搜索
            form.on('submit(search)', function (obj) {
                abc.search('listData', '@(Url.Action("GetList"))', obj.field, { method: "post", done: window.tableDone });
                return false;
            });
            $("#search").click();//初始化完成后 搜索一次
            window.refresh = function () {
                //table.reload("listData");
                $("#search").click();
            };
            
           
            //事件集合
            var active = {
                    example: function () {
                    },
                    example1: function () {
                        }
                    };
            //注册layui-btn 事件
            $('.layui-btn').on('click', function(){
                var type = $(this).data('type');
                active[type] ? active[type].call(this) : '';
            });
    
            // 初始化日期选择
            //abc.initDate('StartDate,EndDate');
        });
    </script>
}
